<aside class="w-full p-6 sm:w-60" [ngClass]="['bg' + contrast, 'text' + defaultInv]">
	<nav class="space-y-8 text-sm">
		<div class="space-y-2">
			<h2
				class="text-sm font-semibold tracking-widest uppercase"
				[ngClass]="['text' + plainInv]"
			>
				Getting Started
			</h2>
			<div class="flex flex-col space-y-1">
				<a rel="noopener noreferrer" href="#" class="">Installation</a>
				<a rel="noopener noreferrer" href="#" class="">Plugins</a>
				<a rel="noopener noreferrer" href="#" class="">Migrations</a>
				<a rel="noopener noreferrer" href="#" class="">Appearance</a>
				<a rel="noopener noreferrer" href="#" class="">Mamba UI</a>
			</div>
		</div>

		<div class="space-y-2">
			<h2
				class="text-sm font-semibold tracking-widest uppercase"
				[ngClass]="['text' + plainInv]"
			>
				Dashboard
			</h2>
			<div class="flex flex-col space-y-1">
				<a rel="noopener noreferrer" href="#" class="">Header</a>
				<a rel="noopener noreferrer" href="#" class="">Drawer</a>
				<a rel="noopener noreferrer" href="#" class="">Page Title</a>
				<a rel="noopener noreferrer" href="#" class="">Menus</a>
				<a rel="noopener noreferrer" href="#" class="">Sidebar</a>
				<a rel="noopener noreferrer" href="#" class="">Footer</a>
			</div>
		</div>

		<div class="space-y-2">
			<h2
				class="text-sm font-semibold tracking-widest uppercase"
				[ngClass]="['text' + plainInv]"
			>
				Pages
			</h2>
			<div class="flex flex-col space-y-1">
				<a rel="noopener noreferrer" href="#" class="">Homepage</a>
				<a rel="noopener noreferrer" href="#" class="">Users</a>
				<a rel="noopener noreferrer" href="#" class="">Tools</a>
				<a rel="noopener noreferrer" href="#" class="">Settings</a>
			</div>
		</div>

		<div class="space-y-2">
			<h2
				class="text-sm font-semibold tracking-widest uppercase"
				[ngClass]="['text' + plainInv]"
			>
				Misc
			</h2>
			<div class="flex flex-col space-y-1">
				<a rel="noopener noreferrer" href="#" class="">Tutorials</a>
				<a rel="noopener noreferrer" href="#" class="">Changelog</a>
			</div>
		</div>
	</nav>
</aside>
